<template>
	<div class="login" :class="fontFamily">
		<div class="drag-menu-top">
			<div class="right-menu-btns">
				<i class="el-icon-minus" @click="minimizeFn"></i>
				<i class="el-icon-close" @click="closeFn(false)"></i>
			</div>
		</div>
		<div class="login-warp" :class="device=='desktop' ? 'desktop' : 'mobile'">
			<div class="title">Hello！</div>
			<div class="Subtitle">欢迎来到云玺检测平台</div>
			<el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
				<el-form-item prop="loginName">
					<el-input prefix-icon="el-icon-user" v-model="ruleForm.loginName" :size="size" placeholder="请输入登录名"></el-input>
				</el-form-item>
				<el-form-item prop="password">
					<el-input :type="passwordType" prefix-icon="el-icon-lock" v-model="ruleForm.password" :size="size" placeholder="请输入密码"  @keyup.enter.native="submitForm">
						<i class="lz-icon" :class="passwordType=='password' ? 'el-icon-turn-off':'el-icon-open'" slot="suffix" @click="handleIconClick"></i>
					</el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="submitForm()" :size="size" style="width: 60%;">登录</el-button>
				</el-form-item>
				<el-form-item>
					<router-link to="/Register">
						<el-link :underline="false" type="warning">注册</el-link>
					</router-link>
				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
	const {
		body
	} = document
	const WIDTH = 992
	let that
	import {
		mapGetters,mapActions
	} from 'vuex'
	const fs = require("fs");
	const { ipcRenderer } = require("electron");
	import bus from "/static/js/bus.js"
	export default {
		computed: {
			...mapGetters(['size', 'fontFamily', 'api'])
		},
		name: "login",
		data() {
			return {
				device: 'desktop', //当前为pc
				passwordType: 'password', //是否显示密码
				ruleForm: {
					loginName: '', //登录名
					password: '', //密码
				},
				rules: {
					loginName: {
						required: true,
						message: '请输入登录名',
						trigger: 'blur'
					},
					password: {
						required: true,
						message: '请输入密码',
						trigger: 'blur'
					}
				},
				//要写入的文件配置
				writeData: [{
						id: 1,
						name: '开关机调试',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'powerOn', //指令
								describe: '开机指令', //描述
								isSuccess: null, //当前是否检测合格
							},
							{
								instr: 'shutDown', //指令
								describe: '关机指令', //描述
								isSuccess: null, //当前是否检测合格
							}
						]
					},
					{
						id: 2,
						name: 'OLED显示功能',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
							instr: 'OLEDShow', //指令
							describe: 'OLED显示功能指令', //描述
						}]
					},
					{
						id: 3,
						name: '摄像头功能',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'cameraOpen', //指令
								describe: '开启指令', //描述
							},
							{
								instr: 'cameraClose', //指令
								describe: '关闭指令', //描述
							}
						]
					},
					{
						id: 4,
						name: '声音测试（蜂鸣器）',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'buzzerOpen', //指令
								describe: '开启指令', //描述
							},
							{
								instr: 'buzzerClose', //指令
								describe: '关闭指令', //描述
							}
						]
					},
					{
						id: 5,
						name: 'USB接口功能',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
							instr: 'usb', //指令
							describe: 'USB指令', //描述
						}]
					},
					{
						id: 6,
						name: '电机功能',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'electricOpen', //指令
								describe: '开启指令', //描述
							},
							{
								instr: 'electricClose', //指令
								describe: '关闭指令', //描述
							}
						]
					},
					{
						id: 7,
						name: 'WiFi功能测试',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'wifiOpen', //指令
								describe: '开启指令', //描述
							},
							{
								instr: 'wifiClose', //指令
								describe: '关闭指令', //描述
							}
						]
					},
					{
						id: 8,
						name: 'LTE功能测试',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'LTEOpen', //指令
								describe: '开启指令', //描述
							},
							{
								instr: 'LTEClose', //指令
								describe: '关闭指令', //描述
							}
						]
					},
					{
						id: 9,
						name: '按键测试',
						popUp: true, //是否需要弹出框，等待人为给出结果
						commands: [{ //命令
								instr: 'openBtn', //指令
								describe: '开机指令', //描述
							},
							{
								instr: 'closeBtn', //指令
								describe: '关机指令', //描述
							}
						]
					}
				],
			}
		},
		mounted() {
			that=this
			
			
			this.$_resizeHandler()
			window.addEventListener('resize', this.$_resizeHandler)
			
		},
		methods: {
			...mapActions('user',['set_Login_info']),
			//最小化窗口
			minimizeFn(){
				ipcRenderer.send("sendMessage",{
					action:'min-app'
				});
			},
			//关闭窗口
			closeFn(bol){
				ipcRenderer.send("sendMessage",{
					action:'close-app',//关闭窗口
					isLogin:bol,//是否登录进入首页
				});
			},
			
			handleIconClick() {
				if (this.passwordType == 'password') {
					this.passwordType = 'text'
				} else {
					this.passwordType = 'password'
				}
			},
			//登录提交
			submitForm() {
				this.$refs.ruleForm.validate((valid) => {
					if (valid) {
						if(that.ruleForm.loginName=='admin'&&that.ruleForm.password=='admin'){
							that.ruleForm.token='ddsahdijashdasdsadsa'
							console.log(that);
							that.$lzStore.set('userInfo',that.ruleForm)
							that.$lzStore.set('token',that.ruleForm.token)
							// that.set_Login_info(that.ruleForm)
							that.$router.push({name:'Home',path:"/Home"})
							//关闭窗口
							that.closeFn(true)
						}else{
							that.$message.warning('账号或密码不正确')
						}
						// let req = {
						// 	showLoading:true,
						// 	...that.ruleForm
						// }
						// this.GLOBAL.doPost(this.api.GLOBAL_oa_login, req).then(res => {
						// 	console.log(res);
						// 	if(res.code=='200'){
						// 		that.set_Login_info(res.data)
						// 		that.$router.push({name:'Home',path:"/Home"})
						// 	}
						// })
					} else {
						return false;
					}
				});

				
			},

			$_isMobile() {
				const rect = body.getBoundingClientRect()
				return rect.width - 1 < WIDTH
			},
			$_resizeHandler() {
				if (!document.hidden) {
					const isMobile = this.$_isMobile()
					if (isMobile) {
						this.device = 'mobile'
					} else {
						this.device = 'desktop'
					}
				}
			}
		}
	}
</script>

<style scoped="scoped" lang="scss">
	@import './login.scss';
</style>
